<template>
  <div>
    <FilterTable
      ref="table"
      height="auto"
      :dataSource="tableDataList"
      :isMemoryPagination="true"
      selectionType="single"
      :columns="tableColumns"
      columnsRef="partPartOtherPartFinancialStatementSalerSelect"
      :onColumnsChange="columns => (this.tableColumns = columns)"
      :onRowSelectChange="handleRowSelect"
    ></FilterTable>

    <div class="bottomBtnWrap">
      <el-button @click="handleClose">取消</el-button>
      <el-button type="primary" @click="handleConfirm">确定</el-button>
    </div>
  </div>
</template>

<script>
import { queryAllSaler } from '@/api/part/partOther/partFinancialStatement/index.js';
import { searchRoleByCode } from '@/api/common/empSelect/index';
import dictCode from '@/utils/dictCode';

export default {
  props: ['index', 'type'],
  data() {
    return {
      tableDataList: [],
      tableColumns: this.createTableColumns(),
      selectedRow: [] // 选中的人员
    };
  },
  mounted() {
    this.querySalerInfo();
  },
  methods: {
    createTableColumns() {
      return [
        {
          title: '姓名',
          dataIndex: 'employeeName'
        },
        {
          title: '人员id',
          dataIndex: 'userId'
        },
        {
          title: '所属经销商',
          dataIndex: 'dealerName'
        },
        {
          title: '经销商code',
          dataIndex: 'dealerCode'
        }
      ];
    },
    async querySalerInfo() {
      this.$refs.table.START_LOADING();
      let roleParams = { role: dictCode[this.type] };
      let res = await searchRoleByCode(roleParams);
      this.$refs.table.STOP_LOADING();
      this.tableDataList = res.data;
    },
    handleRowSelect(e) {
      this.selectedRow = e;
    },
    // 点击确定
    handleConfirm() {
      if (this.selectedRow.length) {
        this.$emit('onConfirm', {
          index: this.index,
          salerInfo: this.selectedRow[0]
        });
        this.handleClose();
      }
    },
    handleClose() {
      this.$emit('close');
    }
  }
};
</script>

<style scoped>
.bottomBtnWrap {
  position: absolute;
  left: 0px;
  bottom: 0px;
  right: 0px;
  z-index: 9;
  border-top: 1px solid rgb(233, 233, 233);
  padding: 10px 20px;
  background: rgb(255, 255, 255);
  text-align: right;
}
</style>
